<template>
  <custom-modal
    v-if="visible"
    :width="width"
    :visible="visible"
    :title="$t('downloadAttachments')"
    :destroyOnClose="true"
    :bodyStyle="{ height: '420px', overflowY: 'auto' }"
    modalCls=".showDownloadFileModal"
    class="showDownloadFileModal"
    @cancel="handleCancel"
  >
    <template slot="footer">
      <a-button
        type="primary"
        @click.stop="
          () => {
            visible = false
          }
        "
      >{{ $t('back') }}</a-button>
    </template>
    <display-tb-list :lists="files"></display-tb-list>
  </custom-modal>
</template>
<script>
import CustomModal from '@/components/CustomModal/index.vue'
import DisplayTbList from './displayTbList'
export default {
  components: {
    CustomModal,
    DisplayTbList
  },
  props: {
    files: {
      type: Array,
      default () {
        return []
      }
    },
    width: {
      type: String,
      default: '50vw'
    }
  },
  data () {
    return {
      visible: false
    }
  },
  watch: {
    visible: {
      handler (val) {
        if (val) {
          this.getData()
        } else {
          this.resetData()
        }
      },
      immediate: true
    }
  },
  methods: {
    handleCancel () {
      this.visible = false
    },
    toggleVisible (val) {
      this.visible = val
    },
    getData () {
    },
    resetData () {
      this.items = []
      this.loading = false
    }
  }
}
</script>
<style lang="less">
.showAuditProcessModal {
  .ant-modal-header {
    border-bottom: none;
    padding:16px 24px 10px 24px;
  }
}
</style>
